﻿@{
    ViewData["Title"] = "EmployeeRegistrationView";
    Layout = null;
}


<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width"/>
    <title>员工登记</title>
    
    <link href="~/Content/bootstrap-theme.css" rel="stylesheet"/>
    <link href="~/layui/css/layui.css" rel="stylesheet"/>
    <link href="~/layer/skin/layer.css" rel="stylesheet"/>

    <style>
        body { margin: 10px; }

        .demo-carousel {
            height: 200px;
            line-height: 200px;
            text-align: center;
        }
        .layui-table-tool-self { display: none; }
    </style>

</head>
<body>
<div>
    <table>
        <tr>
            <td>
                <div class="layui-form-item">
                    <label class="layui-form-label">类 别:</label>
                    <div class="layui-input-block">
                        <select id="Category">
                            <option value=" ">全部</option>
                            <option value="正式员工">正式员工</option>
                            <option value="实习生">实习生</option>
                            <option value="试用工">试用工</option>
                        </select>
                    </div>
                </div>
            </td>
            <td>
                <div class="layui-form-item">
                    <label class="layui-form-label">部  门：</label>
                    <div class="layui-input-block">
                        <select id="Department" name="Department" onchange="GetPositionInfoList()">
                        </select>     
                    </div>
                </div>
            </td>
            <td>
                    <div class="layui-form-item">
                        <label class="layui-form-label">职  位：</label>
                        <div class="layui-input-block">
                            <select id="Position" name="Position" lay-verify="">
                            </select>  
                        </div>
                    </div>
            </td>
        </tr>
        <tr>
            <td>
                <div class="layui-form-item">
                    <label class="layui-form-label">手机号：</label>
                    <div class="layui-input-block">
                        <input type="number" name="title" required id="phone" lay-verify="required" placeholder="请输入手机号" autocomplete="off" class="layui-input">
                    </div>
                </div>
            </td>
            <td>
                <div class="layui-form-item">
                    <label class="layui-form-label">姓  名：</label>
                    <div class="layui-input-block">
                        <input type="text" name="title" required id="name" lay-verify="required" placeholder="请输入姓名" autocomplete="off" class="layui-input">
                    </div>
                </div>
            </td>
            <td>
                <div class="layui-form-item">
                    <button id="Query" class="layui-btn layui-btn-radius layui-btn-normal">
                        <i class="layui-icon layui-icon-search"></i> 查询
                    </button>
                    <button onclick="Reset()"  class="layui-btn layui-btn-radius layui-btn-primary">
                        <i class="layui-icon layui-icon-return"></i> 重置
                    </button>
                </div>
            </td>
        </tr>
    </table>
</div>
<table class="layui-hide" id="demo" lay-filter="test"></table>
<script type="text/html" id="barDemo">
    <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="detail">查看</a>
    <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="delete">删除</a>
</script>

<script src="~/Scripts/jquery-3.4.1.min.js"></script>
<script src="~/layui/layui.js"></script>
<script src="~/layer/layer.js"></script>
<script>

    //文档准备就绪函数
    $(function() {
        GetDeptinfoList();
    });

    //获取部门集合
    function GetDeptinfoList() {
        $.get("/PersonnelMatters/GetDeptinfoList",
            function(res) {
                var str = '<option value="0">请选择一个职位</option>';
                res.forEach(a => {
                    str+=(' <option value="' + a.id + '">' + a.name + '</option>');
                });
                $("#Department").append(str);
            });
        GetPositionInfoList();
    }
    
    //获取职业集合
    function GetPositionInfoList() {
         var id=$("#Department").val();
         $("#Position").empty();
        $.get("/PersonnelMatters/GetPositionInfoList?id="+id,
            function(res) {
                var str = '<option value="0">请选择一个职位</option>';
                res.forEach(a => {
                    str+=(' <option value="' + a.id + '">' + a.name + '</option>');
                });
                $("#Position").append(str);
            });
    }

    function Reset() {
        $("#name").val(" ");
        $("#phone").val(" ");
        $("#Department").val("0");
        $("#Category").val("");
        $("#Position").val("0");
    }

    //获取当前日期
    var date = new Date();
    layui.use(['laydate', 'laypage', 'layer', 'table', 'carousel', 'upload', 'element', 'slider'],
        function() {
            var layer = layui.layer, table = layui.table;
            table.render({
                elem: "#demo",
                height: 420,
                url: '/PersonnelMatters/GetBasicList',
                title: '员工登记',
                page: true,
                toolbar: 'default', //头工具栏
                limit: 5,
                limits: [5, 10],
                cols: [
                    [//表头
                        { type: 'checkbox', fixed: 'left' } //锁定第一列
                        , { field: 'name', title: '姓名', width: 80 },
                        { field: 'sex', title: '性别', width: 50 },
                        { field: 'depName', title: '部门', width: 80 },
                        { field: 'tName', title: '职位', width: 110 },
                        { field: 'bphone', title: '手机号', width: 130 },
                        { field: 'bacademy', title: '院校', width: 150 },
                        { field: 'bmajor', title: '专业', width: 90 },
                        { field: 'bcolumn', title: '家庭住址', width: 200 },
                        { field: 'bentry', title: '入职日期',width: 140, templet: "<div>{{layui.util.toDateString(d.create_time*1000, 'yyyy年MM月dd日 ')}}</div>" },
                        {
                            field: 'workingYears',
                            title: '工龄',
                            width: 80,
                            templet: function(d) {
                                return  date.getFullYear() - layui.util.toDateString(d.bentry, 'yyyy') + "年";
                            }
                        },
                        { field: 'category', title: '类别', width: 90 }, {
                            field: 'state',
                            title: '状态',
                            width: 80,
                            templet: function(d) {
                                return d.bzt === 0 ? "待入职" : d.bzt === 1 ? "试用期" : d.bzt === 2 ? "待转正" : d.bzt === 3 ? "已转正" : d.bzt === 4 ? "待离职" : "已离职";
                            }
                        },
                        { field: 'bdatess', title: '创建时间',width: 140, templet: "<div>{{layui.util.toDateString(d.create_time*1000, 'yyyy年MM月dd日 ')}}</div>" },
                        { fixed: 'right', width: 180, align: 'center', toolbar: '#barDemo' }
                    ]
                ]

            });

            $("#Query").click(function(){
                var name = $("#name").val();
                var phone = $("#phone").val();
                var departmentId = $("#Department").val()==null?0:$("#Department").val();
                var category = $("#Category").val();
                var positionId = $("#Position").val()==null?0:$("#Position").val();
                table.reload('demo', {
                    url: '/PersonnelMatters/GetBasicList'
                    ,where: {
                        name : name,
                        phone : phone,
                        departmentId : departmentId,
                        category : category,
                        positionId : positionId
                    }
                    ,page: {
                        curr: 1
                    }
                });
            });

            //监听头工具栏事件
            table.on('toolbar',
                function(obj) {
                    var checkStatus = table.checkStatus(obj.config.id), data = checkStatus.data; //获取选中的数据
                    switch (obj.event) {
                    case 'add':
                        location.href = "/PersonnelMatters/AddBasicView";
                        break;
                    case 'update':
                        if (data.length === 0) {
                            layer.msg('请选择一行');
                        } else if (data.length > 1) {
                            layer.msg('只能同时编辑一个');
                        } else {
                            location.href = "/PersonnelMatters/ModifyBaView?id=" + data.id;
                        }
                        break;
                    case 'delete':
                        if (data.length === 0) {
                            layer.msg('请选择一行');
                        } else {
                            var ids = [];
                            for (var i = 0; i < checkStatus.data.length; i++) {
                                ids.push(checkStatus.data[i].id);
                            }
                            layer.confirm('真的删除行么',
                                function(index) {
                                    layer.close(index);
                                    $.post("/PersonnelMatters/DelBasicById?id=" + ids.toString(),
                                        function(res) {
                                            if (res > 0) {
                                                layer.msg("删除成功!");
                                                location.reload();
                                            } else {
                                                layer.msg("删除失败!");
                                            }
                                        });
                                });
                        }
                        break;
                    };
                });

            //监听行工具事件
            table.on('tool(test)',
                function(obj) { //注：tool 是工具条事件名，test 是 table 原始容器的属性 lay-filter="对应的值"
                    var data = obj.data //获得当前行数据,
                        layEvent = obj.event; //获得 lay-event 对应的值
                    if (layEvent === 'detail') {
                        location.href = "/PersonnelMatters/BackFillingView?id=" + data.id;
                    } else if (layEvent === 'delete') {
                        layer.confirm('真的删除行么',
                            function(index) {
                                obj.del(); //删除对应行（tr）的DOM结构
                                layer.close(index);
                                $.post("/PersonnelMatters/DelBasicById?id=" + data.id,
                                    function(res) {
                                        if (res > 0) {
                                            layer.msg("删除成功!");
                                            location.reload();
                                        } else {
                                            layer.msg("删除失败!");
                                        }
                                    });
                            });
                    } else if (layEvent === 'edit') {
                        location.href = "/PersonnelMatters/ModifyBaView?id=" + data.id;
                    }
                });
        });


</script>

</body>
</html>